<%include ../inc/header.ejs%>
<!-- html主体代码 start -->
<table class="layui-table">
    <thead>
    <tr>
        <th>序号</th>
        <th>菜单名称</th>
        <th>排序</th>
        <th>
            URL地址
        </th>
        <th width="100px">
            <button class="layui-btn layui-btn-normal f-right btnOp layui-btn-small">
                <i class="layui-icon">&#xe61f;</i>
            </button>
        </th>
    </tr>
    </thead>
    <tbody id="list-menu">

    </tbody>
</table>
<div id="list-page" class="list-page"></div>
<!-- html主体代码 end -->
<%include ../inc/js.ejs%>
<!-- 私有脚本 start -->
<script>
    var index = 1;
    var size = 8;
    var opId = 0;
    $(function () {
        $('.btnOp').click(function () {
            opId = 0;
            op.form();
        });
        op.list();
    })
    var op = {
        form:function () {
            layer.open({
                title:"菜单操作",
                type: 2,
                area: ['700px','500px'],
                closeBtn: 0,
                resize:false,
                content: '/core/menu/form/'+opId,
                btn: ['操 作', '关 闭'],
                btn1: function(index, layero){
                    var win = getIframe();
                    var obj = win.contentWindow.getPageVal();
                    if(obj){
                        var param = {url:'/core/menu/opt/'+opId,data:obj,type:'POST'};
                        var request = $.ajaxs(param);
                        request.done(function(d){
                            if(d.error == 0){
                                win.contentWindow.initForm();
                                op.list();
                                if(opId>0){
                                    layer.close(index);
                                }
                            }
                            tips(d.message);
                        }).fail(function () {
                            tips("网络异常");
                        });
                    }
                },
                btn2: function(index, layero){
                    layer.close(index);
                }
            });
        },
        list:function () {
            var where = {index:index,size:size};
            var param = {url:'/core/menu/list',data:where,type:'POST'};
            var request = $.ajaxs(param);
            request.done(function(d){
                if(index ==1){
                    initPage(d.total);
                }
                initMenu(d);
            }).fail(function () {
                tips("网络异常");
            });
        }
    }
    function edit(_id) {
        opId = _id;
        op.form();
    }
    function del(_id) {
        layer.confirm('确定要删除这条信息？', {
            btn: ['确定','取消'] //按钮
        }, function(){
            var param = {url:'/core/menu/del/'+_id,type:'GET'};
            var request = $.ajaxs(param);
            request.done(function(d){
                if(d.error == 0){
                    op.list();
                }
                tips(d.message);
            }).fail(function () {
                tips("网络异常");
            });
        }, function(){

        });
    }
    function initMenu(_list) {
        var source = $("#menu-list-template").html();
        var template = Handlebars.compile(source);
        var html = template(_list);
        $('#list-menu').html(html);
    }
    function initPage(_total) {
        var pages = Math.ceil(_total/size);
        laypage({
            cont: 'list-page',
            pages: pages, //总页数
            groups: 5, //连续显示分页数
            jump: function(obj, first){
                if(!first){
                    index = obj.curr;
                    op.list();
                }
            }
        });
    }
</script>
<!-- 数据模板 -->
<script id="menu-list-template" type="text/x-handlebars-template">
    {{#each data}}
        <tr>
            <td>{{format_index @index}}</td>
            <td>{{name}}</td>
            <td>{{sort}}</td>
            <td>{{url}}</td>
            <td>
                <button class="layui-btn layui-btn-small" onclick="edit({{id}});"><i class="layui-icon">&#xe631;</i></button>
                <button class="layui-btn layui-btn-danger layui-btn-small" onclick="del({{id}});"><i class="layui-icon">&#xe640;</i></button>
            </td>
        </tr>
    {{/each}}
</script>
<!-- 私有脚本 end -->
<%include ../inc/footer.ejs%>